<template>
  <div>
    <el-switch v-model="onoff" @change="change">
    </el-switch>
    <span class="password-label">{{password}}</span>
  </div>
</template>

<script>
  export default {
    name: "PasswordColumn",
    data() {
      return {
        onoff: false,
        password: this.passwordText
      }
    },
    props: {
      passwordText: {
        default: '切换可见'
      },
      passwordValue: {
        default: '切换可见'
      }
    },
    methods: {
      change(value) {
        if (value) {

          this.password = this.passwordValue
        } else {

          this.password = this.passwordText
        }
      }
    }
  }
</script>

<style scoped>
  .password-label {
    display: inline-block;
    height: 20px;
    min-width: 100px;
    margin-left: 10px;
  }
</style>
